<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>信访管理查看</title>
  <link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.css">
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/common.css">
  <link rel="stylesheet" href="css/jqueryPage.css">
  <link rel="stylesheet" href="css/home.css">
  <link rel="stylesheet" href="css/petition-list-info.css">
</head>

<body>
  <div class="wrap">
    <div class="box-info">
      <ul class="info-list">
        <li class="active icon icon1"><a href="#baseInfo0">基本信息</a></li>
        <li class="icon icon2"><a href="#baseInfo1">反映人信息</a></li>
        <li class="icon icon3"><a href="#baseInfo2">被反映人信息</a></li>
        <li class="icon icon4"><a href="#baseInfo3">反应的问题</a></li>
        <li class="icon icon5"><a href="#baseInfo4">上级批示信息</a></li>
        <li class="icon icon6"><a href="#baseInfo5">原件查询</a></li>
        <li class="icon icon7"><a href="#baseInfo6">文书列表</a></li>
        <li class="icon icon8"><a href="#baseInfo7">附件列表</a></li>
        <li class="icon icon9"><a href="#baseInfo8">舆情信息</a></li>
      </ul>
    </div>
    <div class="box-form">
      <div class="form-list" id="baseInfo0">
        <div class="box-header">
          <h3 class="header-title">基本信息</h3>
        </div>
        <div class="box-body">
          <table class="tables">
            <tr>
              <th>举报标题：</th>
              <td>
                <input type="text" name="" value="标题示例" />
              </td>
            </tr>
            <tr>
              <th>举报时间：</th>
              <td>
                <input type="text" name="" value="2021-05-30" />
              </td>
            </tr>
            <tr>
              <th>举报方式：</th>
              <td>
                <input type="text" name="" value="信件举报" />
              </td>
            </tr>
            <tr>
              <th>举报人数：</th>
              <td>
                <input type="text" name="" value="3人" />
              </td>
            </tr>
            <tr>
              <th>举报类型：</th>
              <td>
                <input type="text" name="" value="类型名称" />
              </td>
            </tr>
            <tr>
              <th>登记日期：</th>
              <td>
                <input type="text" name="" value="2021-05-01" />
              </td>
            </tr>
          </table>
        </div>
      </div>
      <div class="form-list" id="baseInfo1">
        <div class="box-header">
          <h3 class="header-title">反映人信息</h3>
        </div>
        <div class="box-body">
          <table class="tables">
            <tr>
              <th>举报标题：</th>
              <td>
                <input type="text" name="" value="标题示例" />
              </td>
            </tr>
            <tr>
              <th>举报时间：</th>
              <td>
                <input type="text" name="" value="2021-05-30" />
              </td>
            </tr>
            <tr>
              <th>举报方式：</th>
              <td>
                <input type="text" name="" value="信件举报" />
              </td>
            </tr>
            <tr>
              <th>举报人数：</th>
              <td>
                <input type="text" name="" value="3人" />
              </td>
            </tr>
            <tr>
              <th>举报类型：</th>
              <td>
                <input type="text" name="" value="类型名称" />
              </td>
            </tr>
            <tr>
              <th>登记日期：</th>
              <td>
                <input type="text" name="" value="2021-05-01" />
              </td>
            </tr>
          </table>
        </div>
      </div>
      <div class="form-list" id="baseInfo2">
        <div class="box-header">
          <h3 class="header-title">被反映人信息</h3>
        </div>
        <div class="box-body">
          <table class="tables">
            <tr>
              <th>举报标题：</th>
              <td>
                <input type="text" name="" value="标题示例" />
              </td>
            </tr>
            <tr>
              <th>举报时间：</th>
              <td>
                <input type="text" name="" value="2021-05-30" />
              </td>
            </tr>
            <tr>
              <th>举报方式：</th>
              <td>
                <input type="text" name="" value="信件举报" />
              </td>
            </tr>
            <tr>
              <th>举报人数：</th>
              <td>
                <input type="text" name="" value="3人" />
              </td>
            </tr>
            <tr>
              <th>举报类型：</th>
              <td>
                <input type="text" name="" value="类型名称" />
              </td>
            </tr>
            <tr>
              <th>登记日期：</th>
              <td>
                <input type="text" name="" value="2021-05-01" />
              </td>
            </tr>
          </table>
        </div>
      </div>
      <div class="form-list" id="baseInfo3">
        <div class="box-header">
          <h3 class="header-title">反应内容摘要</h3>
        </div>
        <div class="box-body">
          <textarea class="textarea"></textarea>
        </div>
      </div>
      <div class="form-list" id="baseInfo4">
          <div class="box-header">
            <h3 class="header-title">上级审批意见</h3>
          </div>
          <div class="box-body">
            <table class="tables">
              <tr>
                <th>上级领导1:</th>
                <td>
                  <input data-toggle="modal" data-target="#myModal" type="text" name="" value="通过" />
                </td>
              </tr>
              <tr>
                <th>上级领导2:</th>
                <td>
                  <input type="text" name="" value="待审核" />
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div class="form-list" id="baseInfo5">
          <div class="box-header">
            <h3 class="header-title">附件</h3>
          </div>
          <div class="box-body">
            <div class="enclosure">
              <a href="##">反映信件扫描上传.pdf</a>
              <a href="##">反映信件扫描上传.pdf</a>
              <a href="##">反映信件扫描上传.pdf</a>
              <a href="##">反映信件扫描上传.pdf</a>
            </div>
          </div>
        </div>
    </div>
    <div class="frame-box">
      <button data-toggle="modal" data-target="#myModal1" class="btn btn-gray">转送下级单位</button>
      <button class="btn btn-gray">交办下级单位</button>
      <button class="btn Retained">留存</button>
    </div>
    <!-- 模态框（Modal） -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                  <h4 class="modal-title" id="myModalLabel">审批意见弹出层</h4>
                </div>
                <div class="modal-body">
                  <textarea class="textarea"></textarea>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default btn-gray">转送下级单位</button>
                    <button type="button" class="btn btn-primary btn-gray">交办下级单位</button>
                    <button type="button" class="btn Retained">留存</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel1">提示</h4>
                </div>
                <div class="modal-body">提示信息</div>
                <div class="modal-footer">
                    <button class="btn Retained">留存</button>
                    <button class="btn btn-gray">确定</button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
  </div>
  <script src="./js/jquery-2.1.4.min.js"></script>
  <script src="bootstrap-3.3.7-dist/js/bootstrap.js"></script>

  <script>
  // $('#myModal1').modal(options)
  // $('#myModal').modal(options)
  $(".info-list li").on('click', function(){
    $(this).addClass("active").siblings().removeClass("active");
  })
  </script>
</body>

</html>